// 去除默认样式
.reset();
// a
a {
  .link()
}

// 主题背景/颜色
.theme-bg {
  background: @theme-background;
  color: @text-color;
}
.theme-pane {
  background: @pane-background;
  color: @text-color;
}
.theme-title {
  background: @title-bg;
  color: @title-color;
}
.theme-link {
  color: @theme-link-color;
  &:hover,
  &:active,
  &.active {
    color: @theme-link-color-active;
  }
}

// FLex display helper
.@{prefix}flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  &:before,
  &:after {
      display: flex;
  }
  // x轴原点
  .flex-start {
      justify-content: flex-start;
  }
  // x轴居中
  .flex-center {
      justify-content: center;
  }
  // x轴反方向
  .flex-end {
      justify-content: flex-end;
  }
  // x轴平分
  .flex-space-between {
      justify-content: space-between;
  }
  // x轴有间隔地平分
  .flex-space-around {
      justify-content: space-around;
  }
  // 顶部对齐
  .flex-top {
      align-items: flex-start;
  }
  // 居中对齐
  .flex-middle {
      align-items: center;
  }
  // 底部对齐
  .flex-bottom {
      align-items: flex-end;
  }
}

// 布局 (左右)
.@{prefix}layout{
  .layout();
}
.@{prefix}layout-flex{
  .flexlayout();
}
// 布局（左中右）
.@{prefix}layout-grail{
  .layout-grail();
}
.@{prefix}layout-flex-grail{
  .flexlayout-grail();
}
.@{prefix}row {
  .make-row();
  .make-grid();
}

// 清除浮动
.clearfloat {
  .clearfix();
}

// 按钮
.btn-default {
  .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
}
.btn-primary {
  .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
}
.btn-success {
  .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
.btn-info {
  .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
}
.btn-warning {
  .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
}
.btn-ghost {
  .button-variant(@btn-ghost-color; @btn-ghost-bg; @btn-ghost-border);
}

.btn-small{
  .button-size(@btn-padding-small; @btn-font-size; @line-height-base; @btn-border-radius-small);
}
.btn-large{
  .button-size(@btn-padding-large; @btn-font-size-large; @line-height-base; @btn-border-radius-large);
}

// 方形按钮
.btn-icon-square {
  .btn-styles();
}
// 圆形按钮
.btn-icon-cir {
  .btn-styles();
  border-radius: 50%;
}

// 3d按钮
.btn-3d-primary{
  .btn-3d(@btn-primary-bg)
}

// input
.@{prefix}input {
  .input();
}
.@{prefix}input-large{
  .input-large();
}
.@{prefix}input-small{
  .input-small();
}
.@{prefix}input-error{
  .input-error();
}

// table
.@{prefix}table {
  .table();
}
.@{prefix}table-large {
  .table(@table-td-large-height, @table-th-large-height);
}
.@{prefix}table-small {
  .table(@table-td-small-height, @table-th-small-height);
}

// tab
.@{prefix}tab {
  width: 100%;
  .clearfix();
  &-item {
    .btn-defined(@title-color, none, @primary-color, none, @primary-color);
    text-align: center;
    line-height: @tab-height - 2;
    height: @tab-height;
    float: left;
    padding: @tab-padding;
    border-bottom: 2px solid transparent;
    &.active {
      border-bottom-color: @primary-color;
    }
  }
}


// title, body, footer
.@{prefix}title {
  .title();
}
.@{prefix}body {
  .body();
}
.@{prefix}footer {
  .footer();
}

// modal
.@{prefix}modal {
  .modal();
}

// checkbox
.@{prefix}checkbox {
  .checkbox();
}
.@{prefix}checkbox-active {
  .checkbox-active();
}
.@{prefix}checkbox-half {
  .checkbox-half();
}
.@{prefix}checkbox-active-outline {
  .checkbox-active-outline();
}
.@{prefix}checkbox-half-outline {
  .checkbox-half-outline();
}

// radio
.@{prefix}radio {
  .radio();
}
.@{prefix}radio-active {
  .radio-active();
}

// list
.@{prefix}list {
  .list();
}

// 三角
.triangle-top {
  .triangle(top);
}
.triangle-left {
  .triangle(left);
}
.triangle-bottom {
  .triangle(bottom);
}
.triangle-right {
  .triangle(right);
}

// 
.text-primary {
  .text-emphasis-variant(@primary-color);
}

.bg-primary {
  color: #fff;
  .bg-variant(@primary-color);
}


// close
.@{prefix}close {
  .close();
}

// icon
.icon, .iconfont {
  font-size: @font-size-base;
  color: @text-color;
  vertical-align: middle;
}



// common
.@{prefix}mask{
  .mask();
}
.@{prefix}show{
  .show();
}
.@{prefix}hide{
  .hide();
}
.@{prefix}transition{
  .transition();
}
.@{prefix}text-overflow{
  .text-overflow();
}
.@{prefix}center-block{
  .center-block();
}
.@{prefix}user-noselect{
  .user-select();
}
.@{prefix}fl{
  .fl();
}
.@{prefix}fr{
  .fr();
}
.@{prefix}clearfix{
  .clearfix();
}
.@{prefix}pos-mid{
  .pos-mid-auto();
}
